<template>
	<view class="pages">
		<uni-nav-bar left-icon="left" :title="$t('login.code.Select')" color="#000000" background-color="#FFFFFF"
			:border="false" @clickLeft="back" />
		<view v-for="(item,index) in listItem" :key="index" @click="phoneItem(item)" class="item">
			<view :style="item.code.slice(1)==listCode?'font-weight: bold;':''">
				{{item.cn}}--{{item.en}}
				<!-- <text v-show="item.code.slice(1)==listCode">({{$t('login.code.Current')}})</text> -->
			</view>
			<view>{{item.code}}</view>
		</view>
	</view>
</template>

<script>
	import indexList from '@/utils/country.js'
	export default {
		data() {
			return {
				listCode: 86,
				listItem: indexList.list,
			};
		},
		onLoad(option) {
			this.listCode = option.code
		},
		methods: {
			back() {
				let pages = getCurrentPages(); //获取所有页面栈实例列表
				let nowPage = pages[pages.length - 1]; //当前页页面实例
				let prevPage = pages[pages.length - 2]; //上一页页面实例
				prevPage.$vm.code = this.listCode;
				uni.navigateBack({
					delta: 1
				})
			},
			phoneItem(item) {
				this.listCode = item.code.slice(1)
				this.back()
			},
		}
	}
</script>

<style lang="scss">
	// 导航中间字体大小
	/deep/.uni-nav-bar-text {
		font-size: 34rpx !important;
	}

	.item {
		height: 80rpx;
		border-bottom: 1px solid #F4F3F8;
		padding: 0 20rpx;
		font-size: 32rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		box-sizing: border-box;
	}
</style>